import { createRouter, createWebHistory } from "vue-router";
import layout from "../layout/index.vue";
import team1 from "@/views/team/team1.vue";
import team2 from "@/views/team/team2.vue";
import form_init from "@/views/form/form_init.vue";
import form_model from "@/views/form/form_model.vue";
import table_init from "@/views/table/table_init.vue";
import table_page from "@/views/table/table_page.vue";
import text_index from "@/views/text/child/index.vue";

import parent_view from "@/components/parent_view.vue";
import {
  PieChartOutlined,
  DesktopOutlined,
  UserOutlined,
  TeamOutlined,
  FileOutlined,
} from "@ant-design/icons-vue";
export const routes = [
  {
    path: "/team",
    name: "team",
    component: layout,
    redirect: "/team/team1",
    meta: {
      title: "团队",
      icon: PieChartOutlined,
    },
    children: [
      {
        path: "/team/team1",
        name: "team1", // 路由的name 千万不能重复
        meta: {
          title: "团队1",
          icon: DesktopOutlined,
        },
        component: team1,
      },
      {
        path: "/team/team2",
        name: "team2",
        meta: {
          title: "团队2",
          icon: UserOutlined,
        },
        component: team2,
      },
    ],
  },
  {
    path: "/form",
    name: "form",
    component: layout,
    redirect: "/form/init",
    meta: {
      title: "表单",
      icon: PieChartOutlined,
    },
    children: [
      {
        path: "/form/init",
        name: "form_init", // 路由的name 千万不能重复
        meta: {
          title: "表单初始化",
          icon: PieChartOutlined,
        },
        component: form_init,
      },
      {
        path: "/form/model",
        name: "form_model", // 路由的name 千万不能重复
        meta: {
          title: "表单响应式",
          icon: DesktopOutlined,
        },
        component: form_model,
      },
    ],
  },
  {
    path: "/table",
    name: "table",
    component: layout,
    redirect: "/table/init",
    meta: {
      title: "表格",
      icon: PieChartOutlined,
    },
    children: [
      {
        path: "/table/init",
        name: "table_init", // 路由的name 千万不能重复
        meta: {
          title: "表格初始化",
          icon: DesktopOutlined,
        },
        component: table_init,
      },
      {
        path: "/table/page",
        name: "table_page", // 路由的name 千万不能重复
        meta: {
          title: "表格分页",
          icon: DesktopOutlined,
        },
        component: table_page,
      },
    ],
  },
  {
    path: "/text",
    name: "text",
    component: layout,
    meta: {
      title: "测试",
      icon: PieChartOutlined,
      spread: true, // 用于判断 只有一个子节点时候 是否合并 与 展开
    },
    children: [
      {
        path: "/text/child",
        component: parent_view,
        meta: {
          title: "测试子节点",
          // spread: true, // 用于判断 只有一个子节点时候 是否合并 与 展开
        },
        children: [
          {
            path: "/text/child/index",
            component: text_index,
            meta: {
              title: "子节点",
            },
          },
        ],
      },
    ],
  },
  {
    path: "/file",
    name: "file",
    meta: {
      title: "文件",
      icon: TeamOutlined,
    },
    component: layout,
    redirect: "/file_index",
    children: [
      {
        path: "/file_index",
        name: "file_index",
        meta: {
          title: "单个文件",
          icon: FileOutlined,
        },
        // route level code-splitting
        // this generates a separate chunk (about.[hash].js) for this route
        // which is lazy-loaded when the route is visited.
        component: () =>
          import(/* webpackChunkName: "team1" */ "@/views/file/index.vue"),
      },
    ],
  },
  {
    path: "/vue3",
    name: "vue3",
    meta: {
      title: "vue3官网",
      icon: PieChartOutlined,
      is_link: true, // 是否为外链接 跳转
      href: "https://v3.cn.vuejs.org/",
    },
    component: layout,
  },
];
export const router_list = [
  {
    path: "/",
    name: "login",
    component: () =>
      import(/* webpackChunkName: "about" */ "@/views/login.vue"),
  },
  {
    path: "/index",
    name: "Home",
    component: layout,
    children: [
      {
        path: "/index",
        name: "index",
        // route level code-splitting
        // this generates a separate chunk (about.[hash].js) for this route
        // which is lazy-loaded when the route is visited.
        component: () =>
          import(/* webpackChunkName: "about" */ "@/views/index.vue"),
      },
    ],
  },
  {
    path: "/:id",
    name: "404",
    component: () => import(/* webpackChunkName: "about" */ "@/views/404.vue"),
  },
];
console.log(routes, router_list);
const router = createRouter({
  history: createWebHistory(process.env.BASE_URL),
  routes: [...routes, ...router_list],
});

export default router;
